<template>
  <el-container>
    <el-header>
      <Header />
    </el-header>
    <el-main>
      <router-view :key="$route.fullPath" v-slot="{ Component, route }">
        <transition name="fade" mode="out-in">
          <div>
              <keep-alive :include="['Users','UserDetail']" max="3">
                <component :is="Component" :key="route.name"></component>
              </keep-alive>
          </div>          
        </transition>
      </router-view>
    </el-main>
    <el-footer>
      <router-view name="router-view-footer"></router-view>
    </el-footer>
  </el-container>
</template>
<script setup lang="ts">
import Header from '@/components/Header.vue'
import Footer from '@/components/Footer.vue'



</script>
